<template>
  <div>
    <SpuHeader />
    <SpuAddOrEdit
      v-if="isEdit == 1 || isEdit == 2"
      @toggle="toggle"
      :isEdit="isEdit"
    />
    <SpuContent v-else-if="isEdit == 0" @toggle="toggle" />
    <SpuAddItem v-else-if="isEdit == 3" @toggle="toggle" />
  </div>
</template>

<script lang="ts">
export default {
  name: "XSpu",
};
</script>

<script lang="ts" setup>
import { ref } from "vue";
import SpuHeader from "@/components/Spuheader/index.vue";
import SpuContent from "@/components/SpuContent/index.vue";
import SpuAddOrEdit from "@/components/SpuAddOrEdit/index.vue";
import SpuAddItem from "@/components/SpuAddItem/index.vue";
const isEdit = ref<number>(0);
function toggle(num: number) {
  isEdit.value = num;
}
</script>

<style scoped></style>
